<template>
  <img :src="src" :alt="alt" :style="{width:realRadius}">
</template>

<script>
export default {
  name: 'RoundImage',
  props: {
    src: {
      type: String,
      required: true
    },
    alt: {
      default: '',
      type: String
    },
    radius: {
      type: Number
    }
  },
  computed: {
    realRadius () {
      if (this.radius) { return this.radius + 'px' } else return '100%'
    }
  }
}
</script>

<style scoped lang="less">
  img {
    border-radius: 50%;
  }
</style>
